<!-- Page header -->
<div class="page-header d-print-none">
  <div class="container-xl">
    <div class="row g-2 align-items-center">
      <div class="col">
        <h2 class="page-title">
          用户中心
        </h2>
      </div>
    </div>
  </div>
</div>
<!-- Page body -->
<div class="page-body">
  <div class="container-xl">
    <div class="card">
      <div class="row g-0">
        <div class="col-3 d-none d-md-block border-end">
          <div class="card-body">
            <h4 class="subheader">我的账户</h4>
            <div class="list-group list-group-transparent settings-tabs">
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item active" data-bite-target="#settings-tab-1">常用设置</a>
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item" data-bite-target="#settings-tab-2">求职信息</a>
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item" data-bite-target="#settings-tab-3">安全隐私</a>
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item" id="settings-tab-send-records" data-bite-target="#settings-tab-4">投递记录</a>
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item" id="settings-tab-offers" data-bite-target="#settings-tab-5">邀约管理</a>
              <a href="javascript:void(0);" class="list-group-item list-group-item-action d-flex align-items-center settings-tab-item" id="settings-tab-favorites" data-bite-target="#settings-tab-6">我的收藏</a>
            </div>
          </div>
        </div>
        <!-- 用户Id -->
        <input type="text" style="display: none;" id="settings-user-id">
        <!-- 右侧区域1 常用设置 -->
        <!-- 基本信息 -->
        <div class="col d-flex flex-column" id="settings-tab-1">
          <div class="card-body">
            <h2 class="mb-4">常用设置</h2>
            <h3 class="card-title mt-4">头像</h3>
            <div class="row align-items-center">
              <div class="col-auto">
                <a class="avatar avatar-xl settings-chooice-user-avatar-btn" id="settings-user-avatar"></a>
                <!-- 文件选择 -->
                <input type="file" class="form-control" style="display: none;" id="settings-user-avatar-input">
              </div>
              
              <div class="col-auto">
                <a href="javascript:void(0);" class="btn w-100 settings-chooice-user-avatar-btn">
                  上传头像
                </a>
              </div>
              <div class="col-auto">
                <a href="javascript:void(0);" class="btn btn-outline-danger" data-bs-toggle="modal" data-bs-target="#modal_delete_avatar" id="settings-user-avatar-delete-btn">
                  删除头像
                </a>
              </div>
            </div>
            <h3 class="card-title mt-4">基本信息</h3>
            
            <div class="row g-3">
              <div class="col-md">
                <div class="form-label">专业</div>
                  <select class="form-select" id="settings-user-major-select">
                    <optgroup label="通信工程学院">
                      <option value="1">通信工程系</option>
                      <option value="2">信息工程系</option>
                      <option value="3">电子技术系</option>
                    </optgroup>
                    <optgroup label="电子工程学院">
                      <option value="4">电子工程系</option>
                      <option value="5">电信工程系</option>
                      <option value="6">信息技术系</option>
                      <option value="7">遥感科学与技术系</option>
                    </optgroup>
                    <optgroup label="计算机科学与技术学院">
                      <option value="8">计算机科学系</option>
                      <option value="9">计算机工程系</option>
                      <option value="10">网络工程系</option>
                      <option value="11">软件工程系</option>
                    </optgroup>
                    <optgroup label="机电工程学院">
                      <option value="12">电子机械系</option>
                      <option value="13">工业设计系</option>
                      <option value="14">自动控制系</option>
                      <option value="15">电气工程系</option>
                      <option value="16">测控工程与仪器系</option>
                      <option value="17">电子封装系</option>
                    </optgroup>
                    <optgroup label="光电工程学院">
                      <option value="18">激光技术系</option>
                      <option value="19">红外技术系</option>
                      <option value="20">光电信息系</option>
                      <option value="21">光电仪器系</option>
                    </optgroup>
                    <optgroup label="物理学院">
                      <option value="22">物理系</option>
                      <option value="23">电波科学与技术系</option>
                      <option value="24">光信息科学与技术系</option>
                    </optgroup>
                    <optgroup label="经济与管理学院">
                      <option value="25">信息管理系</option>
                      <option value="26">工商管理系</option>
                      <option value="27">管理工程系</option>
                      <option value="28">电子商务系</option>
                      <option value="29">经济与金融系</option>
                    </optgroup>
                    <optgroup label="数学与统计学院">
                      <option value="30">运筹与控制系</option>
                      <option value="31">概率统计系</option>
                      <option value="32">信息与计算数学系</option>
                      <option value="33">应用数学系</option>
                    </optgroup>
                    <optgroup label="生命科学技术学院">
                      <option value="34">生物技术系</option>
                      <option value="35">生物医学工程系</option>
                      <option value="36">智能医学工程系</option>
                    </optgroup>
                    <optgroup label="空间科学与技术学院">
                      <option value="37">智能探测系</option>
                      <option value="38">导航控制系</option>
                      <option value="39">测控通信系</option>
                    </optgroup>
                    <optgroup label="网络与信息安全学院">
                      <option value="40">网络工程系</option>
                      <option value="41">信息安全系</option>
                    </optgroup>
                    <optgroup label="人工智能学院">
                      <option value="42">智能工程系</option>
                    </optgroup>
                    <optgroup label="微电子学院">
                      <option value="43">集成电路工程系</option>
                      <option value="44">集成系统工程系</option>
                      <option value="45">微电路与器件系</option>
                      <option value="46">微电子学系</option>
                    </optgroup>
                    <optgroup label="先进材料与纳米科技学院">
                      <option value="47">纳米科技系</option>
                      <option value="48">应用化学系</option>
                      <option value="49">材料科学与工程系</option>
                    </optgroup>
                    <optgroup label="人文学院">
                      <option value="50">艺术系</option>
                      <option value="51">历史系</option>
                      <option value="52">中文系</option>
                      <option value="53">哲学系</option>
                    </optgroup>
                  </select>
              </div>
              <div class="col-md">
                <div class="form-label">姓名</div>
                <input type="text" placeholder="请输入姓名" class="form-control" id="settings-user-name">
              </div>
            </div>
            <br />

            <div class="row g-3">
              <div class="col-md">
                <div class="form-label">学号</div>
                <input type="text" placeholder="请输入学号" class="form-control" id="settings-user-sno">
              </div>
              <div class="col-md">
                <div class="form-label">入学时间</div>
                <div class="input-icon mb-2">
                  <input type="text" class="form-control " placeholder="选择入学时间" id="settings-user-enrollment">
                  <span class="input-icon-addon"><!-- Download SVG icon from http://tabler-icons.io/i/calendar -->
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M4 5m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M16 3l0 4"></path><path d="M8 3l0 4"></path><path d="M4 11l16 0"></path><path d="M11 15l1 0"></path><path d="M12 15l0 3"></path></svg>
                  </span>
                </div>
              </div>
            </div>
            <br />

            <div class="row g-3">
              <div class="col-md-6">
                <div class="form-label">性别</div>
                <div>
                  <label class="form-check form-check-inline">
                    <input class="form-check-input settings-user-gender" type="radio" name="settings-user-gender" id="settings-user-gender-female" value="0">
                    <span class="form-check-label">
                      <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-gender-female"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 9m-5 0a5 5 0 1 0 10 0a5 5 0 1 0 -10 0" /><path d="M12 14v7" /><path d="M9 18h6" /></svg>
                       女
                    </span>
                  </label>
                  <label class="form-check form-check-inline">
                    <input class="form-check-input settings-user-gender" type="radio" name="settings-user-gender" id="settings-user-gender-male" value="1">
                    <span class="form-check-label">
                      <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-gender-male"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 14m-5 0a5 5 0 1 0 10 0a5 5 0 1 0 -10 0" /><path d="M19 5l-5.4 5.4" /><path d="M19 5h-5" /><path d="M19 5v5" /></svg>
                       男
                    </span>
                  </label>
                  <label class="form-check form-check-inline">
                    <input class="form-check-input settings-user-gender" type="radio" name="settings-user-gender" id="settings-user-gender-secret" value="2">
                    <span class="form-check-label">
                      <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-gender-agender"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-6 0a6 6 0 1 0 12 0a6 6 0 1 0 -12 0" /><path d="M7 12h11" /></svg>
                       保密
                    </span>
                  </label>
                </div>
              </div>
              <div class="col-md-4">
                <!-- 占位 -->
              </div>
              <div class="col-2 col-sm">
                <div class="form-label">&nbsp;</div>
                <a href="javascript:void(0);" class="btn btn-outline-primary w-100" id="settings-tab-1-base-info-submit-btn">
                  修 改
                </a>
              </div>
            </div>

            <hr>
            <h3 class="card-title mt-4">个人简介</h3>
            <div class="row">
              <div class="col-10">
                <textarea class="form-control" rows="5" id="settings-user-remark"></textarea>
              </div>
              <div class="col-2">
                <a href="javascript:void(0);" class="btn btn-outline-primary w-100" id="settings-tab-1-remark-submit-btn">
                  修 改
                </a>
              </div>
            </div>
            <hr>
            <br />
            <!-- card body 结束 -->
          </div>                 
        </div>

        <!-- 右侧区域2 求职信息 -->
        <div class="col d-flex flex-column" id="settings-tab-2" style="display: none!important; ">
          <div class="card-body">
            <!-- 技能标签 -->
            <h3 class="card-title mt-4">技能标签</h3>
            <p class="card-subtitle">设置技能标签有助于职位发布者搜索到您. </p>
            <p class="card-subtitle">多个技能可以用逗号(,)隔开. 最多设置5个 <strong>eg: java, mysql, python, ppt</strong> </p>
            <div>
              <div class="row g-3">
                <div class="col-9">
                  <input type="text" class="form-control" id="settings-user-tag">
                </div>
                <div class="col-2">
                  <a href="javascript:void(0);" class="btn btn-outline-primary w-100" id="settings-tab-2-tag-submit-btn">
                    修 改
                  </a>
                </div>
              </div>
            </div>
            <hr>

            <!-- 修改简历 -->
            <h3 class="card-title mt-4">简历</h3>
            <div class="row g-3" id="settings-user-resume-preview-div">
              <div class="col-9">
                <h3 class="mb-4">
                  <a href="javascript:void(0);" class="text-indigo" id="settings-user-resume-preview-btn" target="_blank">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-eye"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"></path><path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6"></path></svg>
                    预览简历
                  </a>
                </h3>
              </div>
              <div class="col-2">
                <a href="javascript:void(0);" class="btn btn-outline-danger w-100" id="settings-user-resume-delete-btn" data-bs-toggle="modal" data-bs-target="#modal_delete_resume">
                删除简历
                </a>
              </div>
            </div>

            <div class="row g-3">
              <div class="col-9">
                <input type="file" class="form-control" id="settings-user-resume">
              </div>
              <div class="col-2">
                <a href="javascript:void(0);" class="btn btn-outline-primary w-100" id="settings-user-resume-submit-btn">
                  上 传
                </a>
              </div>
            </div>
            <hr>

            <!-- 隐私状态 -->
            <h3 class="card-title mt-4">是否公开</h3>
            <p class="card-subtitle">个人信息公开后，别人可以搜索到您，同时您的信息也会被别人看到，当拿到Offer之后即时关闭</p>
            <div class="col-2 col-sm-9 col-md-6 col-xl-2">
              <label class="form-check form-switch form-switch-lg">
                <input class="form-check-input" type="checkbox" id="settings-user-privacy-state-change-btn">
                <span class="form-check-label form-check-label-on">当前为 <strong class="badge badge-outline text-green"> 公开 </strong></span>
                <span class="form-check-label form-check-label-off">当前为 <strong class="badge badge-outline text-red"> 隐藏 </strong></span>
              </label>
            </div>
            <hr>
            <br />
          </div>

        </div>

        <!-- 右侧区域3 安全隐私 -->
        <div class="col d-flex flex-column" id="settings-tab-3" style="display: none!important;">
          <div class="card-body">
            <!-- 修改密码 -->
            <h3 class="card-title mt-4">修改密码</h3>
            <div>
              <div class="row g-3">
                <!-- 表单 -->
                <div class="col-9" id="settings-tab-3-change-password-div">
                    <div class="mb-2">
                      <label class="form-label required">
                        原密码
                      </label>
                      <div class="input-group input-group-flat">
                        <input type="password" class="form-control settings-tab-3-security-input" id="settgins-security-old-password" placeholder="请输入密码"  autocomplete="off">
                        <span class="input-group-text">
                          <a href="javascript:void(0);" class="link-secondary settings-tab-3-password-switch" title="显示密码" data-bs-toggle="tooltip">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7" /></svg>
                          </a>
                        </span>
                        <div class="invalid-feedback">原密码不能为空</div>
                      </div>
                    </div>

                    <div class="mb-2">
                      <label class="form-label required">
                        新原密码
                      </label>
                      <div class="input-group input-group-flat">
                        <input type="password" class="form-control settings-tab-3-security-input" id="settgins-security-new-password" placeholder="请输入密码"  autocomplete="off">
                        <span class="input-group-text">
                          <a href="javascript:void(0);" class="link-secondary settings-tab-3-password-switch" title="显示密码" data-bs-toggle="tooltip"><!-- Download SVG icon from http://tabler-icons.io/i/eye -->
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7" /></svg>
                          </a>
                        </span>
                        <div class="invalid-feedback">新密码不能为空</div>
                      </div>
                    </div>
                    <div class="mb-2">
                      <label class="form-label required">
                        确认密码
                      </label>
                      <div class="input-group input-group-flat">
                        <input type="password" class="form-control settings-tab-3-security-input" id="settgins-security-new-password-repeat" placeholder="请输入密码"  autocomplete="off">
                        <span class="input-group-text">
                          <a href="javascript:void(0);" class="link-secondary settings-tab-3-password-switch" title="显示密码" data-bs-toggle="tooltip"><!-- Download SVG icon from http://tabler-icons.io/i/eye -->
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7" /></svg>
                          </a>
                        </span>
                        <div class="invalid-feedback">确认密码不能为空</div>
                      </div>
                    </div>

                    <div class="form-footer">
                      <button type="submit" class="btn btn-outline-primary w-100" id="settgins-security-change-password-submit">提交修改</button>
                    </div>
                </div>
              </div>
            </div>
            <hr>

            <!-- 修改电话号码 -->
            <h3 class="card-title mt-4">修改电话号码</h3>
            <div class="col-9">
              <!-- 新电话号码 -->
              <div class="mb-3">
                <label class="form-label required">新电话号码</label>
                <input type="text" class="form-control settings-tab-3-security-input" placeholder="请输入新电话号码" name="phoneNum" id="settings-modify-phone-num">
                <div class="invalid-feedback">请输入正确的电话号码</div>
              </div>
              <!-- 验证码 -->
              <div class="mb-3">
                <label class="form-label required">验证码</label>
                <div class="input-group">
                  <input type="text" class="form-control settings-tab-3-security-input" placeholder="请输入验证码" name="code" id="settings-modify-phone-code">
                  <button class="btn btn-outline-primary" type="button" id="settings-modify-phone-code-btn">获取验证码
                  </button>
                  <div class="invalid-feedback">验证码不能为空</div>
                </div>
              </div>
              <div class="form-footer">
                <button type="submit" class="btn btn-outline-primary w-100" id="settings-modify-phone-num-btn">提交修改</button>
              </div>
            </div>
            <hr>

            <!-- 修改邮箱地址 -->
            <h3 class="card-title mt-4">修改邮箱地址</h3>
            <div class="col-9">
              <!-- 新邮箱地址 -->
              <div class="mb-3">
                <label class="form-label required">新邮箱地址</label>
                <input type="text" class="form-control settings-tab-3-security-input" placeholder="请输入新邮箱地址" name="email" id="settings-modify-email">
                <div class="invalid-feedback">请输入正确的邮箱地址</div>
              </div>
              <!-- 验证码 -->
              <div class="mb-3">
                <label class="form-label required">验证码</label>
                <div class="input-group">
                  <input type="text" class="form-control settings-tab-3-security-input" placeholder="请输入验证码" name="code" id="settings-modify-email-code">
                  <button class="btn btn-outline-primary" type="button"
                          id="settings-modify-email-code-btn">获取验证码</button>
                  <div class="invalid-feedback">验证码不能为空</div>
                </div>
              </div>
              <div class="form-footer">
                <button type="submit" class="btn btn-outline-primary w-100" id="settings-modify-email-btn">提交修改</button>
              </div>
            </div>
            <hr>
            <br />
          </div>
        </div>

        <!-- 右侧区域4 投递记录 -->
        <div class="col d-flex flex-column" id="settings-tab-4" style="display: none!important; ">
          <div class="card-body">
            <!-- 我投递过的职位 -->
            <h3 class="card-title mt-4">我投递过的职位</h3>
            <hr>
            <div id="settings-send-records-body">
              <!-- 一行开始 -->
              <!-- <div class="row g-0 align-items-center">
                <div class="col-auto">
                  <div class="card-body">
                    <div class="avatar avatar-md" style="background-image: url(./static/jobs/job-1.png)"></div>
                  </div>
                </div>
                <div class="col">
                  <div class="card-body ps-0">
                    <div class="row">
                      <div class="col">
                        <h3 class="mb-0"><a href="javascript:void(0); class="settings-record-tab-job-title">Frontend Web Engineer</a></h3>
                      </div>
                      <div class="col-auto fs-3 text-blue">
                        <span class="badge badge-outline text-azure">已投递</span>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md">
                        <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
                          <div class="list-inline-item">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                              <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
                              <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
                          </svg>
                          小比特
                          </div>
                          <div class="list-inline-item text-blue">
                            <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>
                            <strong>140,000</strong> - <strong>180,000</strong>
                          </div>
                        </div>
                      </div>
                      <div class="col-md-auto">
                        <div class="mt-3 badges">
                          <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
                            <div class="list-inline-item">
                              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>
                              2023-02-22 15:36:23
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <hr> -->
            </div>
            

            <br />
          </div>
          <!-- 分页 -->
          <div class="card-footer d-flex align-items-center">
            <p class="m-0 text-muted bit-paginator-send-records-text"></p>
            <ul class="bit-paginator-send-records pagination m-0 ms-auto"></ul>
          </div>
        </div>

        <!-- 右侧区域5 邀约管理 -->
        <div class="col d-flex flex-column" id="settings-tab-5" style="display: none!important; ">
          <div class="card-body">
            <!-- 我收到的邀约 -->
            <h3 class="card-title mt-4">我收到的邀约</h3>
            <hr>
            <div id="settings-offer-body">
              <!-- <div class="row g-0 align-items-center">
                <div class="col-auto">
                  <div class="card-body">
                    <div class="avatar avatar-md" style="background-image: url(./static/jobs/job-1.png)"></div>
                  </div>
                </div>
                <div class="col">
                  <div class="card-body ps-0">
                    <div class="row">
                      <div class="col">
                        <h3 class="mb-0"><a href="javascript:void(0);" class="settings-offer-tab-job-title">Frontend Web Engineer</a></h3>
                      </div>
                      <div class="col-auto fs-3">
                        <span class="badge badge-outline text-yellow">未处理</span>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md">
                        <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
                          <div class="list-inline-item">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                              <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
                              <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
                          </svg>
                          小比特
                          </div>
                          <div class="list-inline-item text-blue">
                            <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>
                            <strong>140,000</strong> - <strong>180,000</strong>
                          </div>
                        </div>
                      </div>
                      <div class="col-md-auto">
                        <div class="mt-3 badges">
                          <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
                            <div class="list-inline-item">
                              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>
                              2023-02-22 15:36:23
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-auto" style="margin-right: 1em;">
                  <div class="dropdown">
                    <a href="javascript:void(0);" class="btn-action" data-bs-toggle="dropdown" aria-expanded="false">
                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg>
                    </a>
                    <div class="dropdown-menu dropdown-menu-end">
                      <a href="javascript:void(0);" class="dropdown-item settins-offer-tab-accept">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-check"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg>
                        &nbsp;&nbsp;接 受
                      </a>
                      <a href="javascript:void(0);" class="dropdown-item settins-offer-tab-reject">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-x"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 6l-12 12" /><path d="M6 6l12 12" /></svg>
                        &nbsp;&nbsp;拒 绝
                      </a>
                    </div>
                  </div>
                </div>
              </div> -->
            </div>
            <br />
          </div>
          <!-- 分页 -->
          <div class="card-footer d-flex align-items-center">
            <p class="m-0 text-muted bit-paginator-offer-text"></p>
            <ul class="bit-paginator-offer pagination m-0 ms-auto"></ul>
          </div>
        </div>

        <!-- 右侧区域6 我的收藏 -->
        <div class="col d-flex flex-column" id="settings-tab-6" style="display: none!important; ">
          <div class="card-body">
            <!-- 我收到的邀约 -->
            <h3 class="card-title mt-4">我收到的邀约</h3>
            <hr>
            <div id="settings-favorite-body">
              <!-- <div class="row g-0 align-items-center">
                <div class="col-auto">
                  <div class="card-body">
                    <div class="avatar avatar-md" style="background-image: url(./static/jobs/job-1.png)"></div>
                  </div>
                </div>
                <div class="col">
                  <div class="card-body ps-0">
                    <div class="row">
                      <div class="col">
                        <h3 class="mb-0"><a href="javascript:void(0);" class="settings-favorite-tab-job-title">Frontend Web Engineer</a></h3>
                      </div>
                      <div class="col-auto fs-3 text-blue"><svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>
                        <strong>140,000</strong> - <strong>180,000</strong>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md">
                        <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
                          <div class="list-inline-item">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                              <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
                              <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
                           </svg>
                           小比特
                          </div>
                          <div class="list-inline-item">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-clock-edit" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                              <path d="M21 12a9 9 0 1 0 -9.972 8.948c.32 .034 .644 .052 .972 .052"></path>
                              <path d="M12 7v5l2 2"></path>
                              <path d="M18.42 15.61a2.1 2.1 0 0 1 2.97 2.97l-3.39 3.42h-3v-3l3.42 -3.39z"></path>
                           </svg>
                            2023-02-22 15:36:23
                          </div>
                        </div>
                      </div>
                      <div class="col-md-auto">
                        <div class="mt-3 badges">
                            <ul class="list-inline list-inline-dots mb-0">
                              <li class="list-inline-item">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-eye" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                  <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                  <path d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"></path>
                                  <path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7"></path>
                               </svg>
                                 1006
                              </li>
                              <li class="list-inline-item">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-heart" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                  <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                  <path d="M19.5 12.572l-7.5 7.428l-7.5 -7.428a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"></path>
                                </svg>
                                 2008
                              </li>
                              <li class="list-inline-item">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message-circle" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                  <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                  <path d="M3 20l1.3 -3.9a9 8 0 1 1 3.4 2.9l-4.7 1"></path>
                                  <path d="M12 12l0 .01"></path>
                                  <path d="M8 12l0 .01"></path>
                                  <path d="M16 12l0 .01"></path>
                               </svg>
                                 3006
                              </li>
                            </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-auto" style="margin-right: 1em;">
                  <div class="col-6 col-sm-4 col-md-2 col-xl-auto py-3">
                    <a href="javascript:void(0);" class="btn btn-ghost-danger w-100 btn-icon settings-favorite-tab-delete" aria-label="Pinterest">
                      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-trash"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M4 7l16 0"></path><path d="M10 11l0 6"></path><path d="M14 11l0 6"></path><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12"></path><path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3"></path></svg>
                    </a>
                  </div>
                </div>
              </div> -->
              <hr>
            </div>
            <br />
          </div>
          <!-- 分页 -->
          <div class="card-footer d-flex align-items-center">
            <p class="m-0 text-muted bit-paginator-favorite-text"></p>
            <ul class="bit-paginator-favorite pagination m-0 ms-auto"></ul>
          </div>
        </div>

      </div>
    </div>
  </div>
</div>

<!-- 删除头像模态框 -->
<div class="modal modal-blur fade" id="modal_delete_avatar" tabindex="-1" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
    <div class="modal-content">
      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      <div class="modal-status bg-danger"></div>
      <div class="modal-body text-center py-4">
        <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
        <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg>
        <h3>确定要删除当前头像吗?</h3>
        <div class="text-muted">点击确认当前头像将被删除.</div>
      </div>
      <div class="modal-footer">
        <div class="w-100">
          <div class="row">
            <div class="col"><a href="javascript:void(0);" class="btn w-100" data-bs-dismiss="modal">
                取消
              </a></div>
            <div class="col">
              <a href="javascript:void(0);" class="btn btn-danger w-100" data-bs-dismiss="modal" id="settings-user-avatar-delete-confirm-btn">
                确定
              </a></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- 删除简历模态框 -->
<div class="modal modal-blur fade" id="modal_delete_resume" tabindex="-1" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
    <div class="modal-content">
      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      <div class="modal-status bg-danger"></div>
      <div class="modal-body text-center py-4">
        <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
        <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg>
        <h3>确定要删除当前简历吗?</h3>
        <div class="text-muted">点击确认当前简历将被删除.</div>
      </div>
      <div class="modal-footer">
        <div class="w-100">
          <div class="row">
            <div class="col"><a href="javascript:void(0);" class="btn w-100" data-bs-dismiss="modal">
                取消
              </a></div>
            <div class="col"><a href="javascript:void(0);" class="btn btn-danger w-100" data-bs-dismiss="modal" id="settings-user-resume-delete-confirm-btn">
                确定
              </a></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script>
  $(function() {
    // 获取用户信息
    $.ajax({
      type: 'get',
      url: 'user/details',
      contentType: 'application/x-www-form-urlencoded',
      success : function (respData) {
        // 失败
        if (respData.code != 0) {
          // 提示
          $.toast({
            heading: '提示',
            text: respData.message,
            icon: 'info'
          });
          return;
        }
        // 全局用户记录
        currentUser = respData.data;
        // 初始化页面用户信息
        initUserInfo(respData.data);
      }
    });

    // 初始化页面用户信息
    function initUserInfo(user) {
      // 用户Id
      $('#settings-user-id').val(user.id);
      // 头像
      if (!user.avatarUrl) {
        user.avatarUrl = avatarUrl;
      }
      $('#settings-user-avatar').css('background-image', 'url(' +  (user.avatarUrl) + ')');
      // 专业
      $('#settings-user-major-select').val(user.majorId);
      // 姓名
      $('#settings-user-name').val(user.name);
      // 学号
      $('#settings-user-sno').val(user.sno);
      // 入学时间
      // $('#settings-user-enrollment').val(user.enrollment);
      picker.setDate(user.enrollment);
      // 性别
      $('input[name="settings-user-gender"]').eq(user.gender).attr('checked', 'checked');
      // 个人简介
      $('#settings-user-remark').val(user.remark);
      // 技能标签
      $('#settings-user-tag').val(user.tag);
      // 简历
      if (user.resumeUrl) {
        // 设置简历预览
        $('#settings-user-resume-preview-div').removeAttr('style');
        $('#settings-user-resume-preview-btn').attr('href', user.resumeUrl);
      } else {
        // 隐藏简历预览
        $('#settings-user-resume-preview-div').attr('style', 'display: none;');
        $('#settings-user-resume-preview-btn').attr('href', 'javascript:void(0);');
      }
      // 隐私状态
      if (user.privacyState == 1) {
        $('#settings-user-privacy-state-change-btn').prop('checked', true);
      } else {
        $('#settings-user-privacy-state-change-btn').prop('checked', false);
      }
      
    }
  
    // ================ 绑定事件 ==========================
    // 上传头像
    $('#settings-user-avatar-input').change(function () {
      // 校验
      let avatarEL = $('#settings-user-avatar-input');
      if (!avatarEL.val()) {
        console.info('没有图片');
        reutrn;
      }
      // 构造数据
      let formData = new FormData();
      let uploadFile = avatarEL[0].files[0];
      formData.append('avatar', uploadFile);
      // 发送请求
      $.ajax ({
        type : 'post',
        url : 'user/uploadAvatar',
        data: formData,
        contentType: false,
        processData: false,
        success : function(respData) {
          if (respData.code != 0) {
            toastWarning(respData.message);
            return;
          }
          toastSuccess('头像上传成功');
          // 全局用户记录
          currentUser = respData.data;
          // 更新导航栏用户头像
          $('#index-nav-user-avatar').css('background-image', 'url(' +  (currentUser.avatarUrl) + ')');
          // 更新个人中心用户头像
          $('#settings-user-avatar').css('background-image', 'url(' +  (currentUser.avatarUrl) + ')');
        }
      });
    });
    
    // 删除头像
    $('#settings-user-avatar-delete-confirm-btn').click(function () {
      // 发送请求
      $.ajax({
        type : 'delete',
        url : 'user/deleteAvatar',
        contentType: 'application/x-www-form-urlencoded',
        success : function (respData) {
          if (respData.code != 0) {
            toastWarning(respData.message);
            return;
          }
          toastSuccess('头像删除成功');
          // 全局用户记录
          currentUser = respData.data;
          currentUser.avatarUrl = avatarUrl
          // 更新导航栏用户头像
          $('#index-nav-user-avatar').css('background-image', 'url(' +  (currentUser.avatarUrl) + ')');
          // 更新个人中心用户头像
          $('#settings-user-avatar').css('background-image', 'url(' +  (currentUser.avatarUrl) + ')');
        }
      });
    })
  
    // 个人基本信息修改
    $('#settings-tab-1-base-info-submit-btn').click(function () {
      // 校验
      // 专业
      let userMajorEL = $('#settings-user-major-select');
      if (!userMajorEL.val()) {
        userMajorEL.focus();
        return;
      }
      // 姓名
      let userNameEL = $('#settings-user-name');
      if (!userNameEL.val()) {
        userNameEL.focus();
        return;
      }
      // 学号
      let userSNoEL = $('#settings-user-sno');
      if (!userSNoEL.val()) {
        userSNoEL.focus();
        return;
      }
      // 入学时间
      let userEnrollmentEL = $('#settings-user-enrollment');
      if (!userEnrollmentEL.val()) {
        userEnrollmentEL.focus();
        return;
      }
      // 性别
      let userGenderEL = $('input[name="settings-user-gender"]:checked');
      if (!userGenderEL.val()) {
        toastWarning('请选项性别');
        return;
      }
      // 构造数据
      let sendData = {
        majorId : userMajorEL.val(),
        name : userNameEL.val(),
        sno : userSNoEL.val(),
        enrollment : userEnrollmentEL.val(),
        gender : userGenderEL.val()
      };
      // 发送请求
      $.ajax ({
        type : 'post',
        url : 'user/modify', 
        data : JSON.stringify(sendData),
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return;
          }
          // 提示
          toastSuccess('基本信息修改成功');
          // 更新全局变量
          currentUser = respData.data;
          // 更新页面内容
          // 专业
          $('#settings-user-major-select').val(currentUser.majorId);
          // 姓名
          $('#settings-user-name').val(currentUser.name);
          // 学号
          $('#settings-user-sno').val(currentUser.sno);
          // 入学时间
          $('#settings-user-enrollment').val(currentUser.enrollment);
          // 性别
          $('input[name="settings-user-gender"]').eq(currentUser.gender).attr('checked', 'checked');
        }
      });
    });

    // 个人简介
    $('#settings-tab-1-remark-submit-btn').click(function () {
      // 校验
      let userRemarkEL = $('#settings-user-remark');
      if (!userRemarkEL.val()) {
        userRemarkEL.focus();
        return;
      }
      // 构造数据
      let sendData = {
        remark : userRemarkEL.val()
      };
      // 发送请求
      $.ajax ({
        type : 'post',
        url : 'user/modify', 
        data : JSON.stringify(sendData),
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return;
          }
          // 提示
          toastSuccess('个人简介修改成功');
          // 更新全局变量
          currentUser = respData.data;
          // 更新页面内容
          // 个人简介
          $('#settings-user-remark').val(currentUser.remark);
        }
      });
    });

    // 技能标签
    $('#settings-tab-2-tag-submit-btn').click(function () {
      // 校验
      let userTagEL = $('#settings-user-tag');
      if (!userTagEL.val()) {
        userTagEL.focus();
        return;
      }
      // 构造数据
      let sendData = {
        tag : userTagEL.val()
      };
      // 发送请求
      $.ajax ({
        type : 'post',
        url : 'user/modify', 
        data : JSON.stringify(sendData),
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return;
          }
          // 提示
          toastSuccess('技能标签修改成功');
          // 更新全局变量
          currentUser = respData.data;
          // 更新页面内容
          // 技能标签
          $('#settings-user-tag').val(currentUser.tag);
        }
      });
    });

    // 删除简历
    $('#settings-user-resume-delete-confirm-btn').click(function(){
      // 发送请求
      $.ajax({
        type : 'delete',
        url : 'user/deleteResume',
        contentType: 'application/x-www-form-urlencoded',
        success : function (respData) {
          if (respData.code != 0) {
            toastWarning(respData.message);
            return;
          }
          toastSuccess('简历删除成功, 同时状态设置为"隐私", 别人不能通过搜索找到您.');
          // 全局用户记录
          currentUser = respData.data;
          currentUser.avatarUrl = avatarUrl
          // 隐藏简历预览
          $('#settings-user-resume-preview-div').attr('style', 'display: none;');
          $('#settings-user-resume-preview-btn').attr('href', 'javascript:void(0);');
          // 隐私状态
          if (currentUser.privacyState == 1) {
            $('#settings-user-privacy-state-change-btn').prop('checked', true);
          } else {
            $('#settings-user-privacy-state-change-btn').prop('checked', false);
          }
        }
      });
    });

    // 上传简历
    $('#settings-user-resume-submit-btn').click(function() {
      let userResumeEL = $('#settings-user-resume');
      if (!userResumeEL.val()) {
        console.info('请选择上传的简历文件');
        return;
      }
      // 构造数据
      let formData = new FormData();
      let uploadFile = userResumeEL[0].files[0];
      formData.append('file', uploadFile);
      // 发送请求
      $.ajax ({
        type : 'post',
        url : 'user/uploadResume',
        data: formData,
        contentType: false,
        processData: false,
        success : function(respData) {
          if (respData.code != 0) {
            toastWarning(respData.message);
            return;
          }
          toastSuccess('简历上传成功, 如果要公开自己的信息, 请手动开启.');
          // 全局用户记录
          currentUser = respData.data;
          // 设置简历预览
          $('#settings-user-resume-preview-div').removeAttr('style');
          $('#settings-user-resume-preview-btn').attr('href', currentUser.resumeUrl);
          // 清空上传输入框
          userResumeEL.val('');
        }
      });

    });

    // 隐私状态是否公开
    $('#settings-user-privacy-state-change-btn').change(function(){
      let userPrivateStateEL = $('#settings-user-privacy-state-change-btn');
      // 状态
      let privacyState = 0;
      if (userPrivateStateEL.prop('checked')) {
        privacyState = 1;
      }

      let sendData = {
        privacyState : privacyState
      }
      // 发送请求
      $.ajax({
        type : 'put',
        url : 'user/modifyPrivateState',
        data : sendData,
        contentType: 'application/x-www-form-urlencoded',
        success : function (respData) {
          if (respData.code != 0) {
            // 设置为原来的状态
            $('#settings-user-privacy-state-change-btn').prop('checked', !userPrivateStateEL.prop('checked'));
            // 提示
            toastWarning(respData.message);
            return;
          }
          // 提示
          toastSuccess("隐私状态修改成功");
        }
      });
    });

    // ======================= Tab 3 ==========================
    // 修改密码
    $('#settgins-security-change-password-submit').click(function () {
      // 获取原密码
      let oldPwdEL = $('#settgins-security-old-password');
      if (!oldPwdEL.val()) {
        oldPwdEL.focus();
        return;
      }
      // 获取新密码
      let newPwdEL = $('#settgins-security-new-password');
      if (!newPwdEL.val()) {
        newPwdEL.focus();
        return;
      }
      // 获取确认密码
      let repeatPwdEL = $('#settgins-security-new-password-repeat');
      if (!repeatPwdEL.val()) {
        repeatPwdEL.focus();
        return;
      }
      // 新密码与确认密码是否相同
      if (newPwdEL.val() != repeatPwdEL.val()) {
        toastWarning('两次输入的密码不一致.');
        repeatPwdEL.val('');
        repeatPwdEL.focus();
        return;
      }
      // 要提交的数据对象
      let sendData = {
        oldPassword : oldPwdEL.val(),
        newPassword : newPwdEL.val(),
        repeatPassword : repeatPwdEL.val()
      };
      // 发送请求
      $.ajax({
        type : 'post',
        url : 'user/modifyPwd', 
        data : JSON.stringify(sendData),
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return;
          }
          // 提示
          toastSuccess('密码修改成功.')
          // 清空输入框
          $('#settings-tab-3-change-password-div .settings-tab-3-security-input').val('').removeClass('is-valid').removeClass('is-invalid');
        }
      });
    });


    let currentSendRecordPageNum = 1;
    
    // 投递记录
    $('#settings-tab-send-records').click(function() {
      loadMyRecordList();
    });

    // 获取投递列表
    function loadMyRecordList() {
      // 分页对象
      let sendData = {
        pageNum : currentSendRecordPageNum,
        pageSize : pageSize
      };
      // 发送请求
      $.ajax({
        type: 'get',
        url : 'deliver/pageByUser',
        contentType: 'application/x-www-form-urlencoded',
        data : sendData,
        success : function (respData) {
          // 失败
          if (respData.code != 0) {
            // 提示
            $.toast({
              heading: '提示',
              text: respData.message,
              icon: 'info'
            });
            return;
          }
          // 成功构建页面
          buildMyRecord(respData.data)
        }
      });
    }
    // 构造我的投递列表
    function buildMyRecord(data) {
      // 清空内容区
      $('#settings-send-records-body').html('');
      // 没有记录
      if (data.rows.length == 0) {
        $('#settings-send-records-body').html('<h3>没有职位记录</h3>');
        $('.bit-paginator-send-records-text').html('');
        $('.bit-paginator-send-records').html('');
        return;
      }
      // 遍历结果
      data.rows.forEach(record => {
        // 发布者头像
        if (!record.receiveUser.avatarUrl) {
          record.receiveUser.avatarUrl = avatarUrl
        }
        // 最高价与最低价
        let priceHtml;
        if (!record.job.rewardLower || !record.job.rewardUpper) {
          priceHtml = '<strong>薪资面议</strong>'
        } else {
          priceHtml = ' <strong>' + record.job.rewardLower + '</strong> - <strong>' + record.job.rewardUpper + '</strong> '
        }
        // 状态
        let stateHtml;
        switch (record.state) {
          case 0:
            stateHtml = '<span class="badge badge-outline text-azure">已投递</span>';
            break;
          case 1:
            stateHtml = '<span class="badge badge-outline text-blue">&nbsp;已 读&nbsp;</span>';
            break;
          case 2:
            stateHtml = '<span class="badge badge-outline text-yellow">面试中</span>';
            break;
          case 3:
            stateHtml = '<span class="badge badge-outline text-green">OFFER</span>';
            break;
          case 5:
            stateHtml = '<span class="badge badge-outline text-red">已拒绝</span>';
            break;
          case 6:
            stateHtml = '<span class="badge badge-outline text-cyan">已入职</span>';
            break;
          default:
            stateHtml = '<span class="badge badge-outline text-yellow">未处理</span>';
            break;
        }
        // 一行记录
        let recordRowHtmlStr = '<div class="row g-0 align-items-center">'
          + ' <div class="col-auto">'
          + ' <div class="card-body">'
          + ' <div class="avatar avatar-md" style="background-image: url(' + record.receiveUser.avatarUrl + ')"></div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col">'
          + ' <div class="card-body ps-0">'
          + ' <div class="row">'
          + ' <div class="col">'
          + ' <h3 class="mb-0"><a href="javascript:void(0);" class="settings-record-tab-job-title">' + record.job.title + '</a></h3>'
          + ' </div>'
          + ' <div class="col-auto fs-3 text-blue">'
          + ' ' + stateHtml
          + ' </div>'
          + ' </div>'
          + ' <div class="row">'
          + ' <div class="col-md">'
          + ' <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">'
          + ' <div class="list-inline-item">'
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">'
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>'
          + ' <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>'
          + ' <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>'
          + ' </svg>'
          + ' ' + record.receiveUser.name
          + ' </div>'
          + ' <div class="list-inline-item text-blue">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>'
          + ' ' + priceHtml
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col-md-auto">'
          + ' <div class="mt-3 badges">'
          + ' <div class="mt-3 list-inline list-inline-dots mb-0 text-muted">'
          + ' <div class="list-inline-item">'
          + ' <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>'
          + ' ' + record.createTime
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <hr>';
        // 转换为jQuery对象
        let recordRowEL = $(recordRowHtmlStr);
        // 绑定事件
        recordRowEL.find('.settings-record-tab-job-title').click(function() {
          // 当前访问的职位Id
          currentJobId = record.job.id;
          // 加载编辑页
          $('#bit-page-content').load('job_details.html');
        });
        // 追加到内容区
        $('#settings-send-records-body').append(recordRowEL);
      });
      // 分页
      // 显示分页
      buildSendRecordPaginator(data);
    }
    // 投递记录分页
    function buildSendRecordPaginator(data) {
      $('.bit-paginator-send-records').jqPaginator({
        totalPages: data.totalPage,
        visiblePages: 10,
        currentPage: data.pageNum,
        first: '<li class="page-item first"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M11 7l-5 5l5 5" /><path d="M17 7l-5 5l5 5" /></svg></a></li>',
        prev: '<li class="page-item prev"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M15 6l-6 6l6 6" /></svg></a></li>',
        next: '<li class="page-item next"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M9 6l6 6l-6 6" /></svg></a></li>',
        last: '<li class="page-item last"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M7 7l5 5l-5 5" /><path d="M13 7l5 5l-5 5" /></svg></a></li>',
        page: '<li class="page-item page"><a class="page-link" href="javascript:void(0)">{{page}}</a></li>',
        onPageChange: function (pageNum, type) {
          $('.bit-paginator-send-records-text').html('当前显示第 ' + pageNum + ' / ' + data.totalPage + ' 页');
          // 当前访问的页号
          currentSendRecordPageNum = pageNum;
          // 加载职位列表
          if (type == 'change') {
            loadMyRecordList(currentSendRecordPageNum);
          }
        }
      });
    }

    let currentOfferPageNum = 1;
    // OFFER记录
    $('#settings-tab-offers').click(function(){
      loadMyOfferList();
    });
    // 获取Offer列表
    function loadMyOfferList() {
      // 分页对象
      let sendData = {
        pageNum : currentOfferPageNum,
        pageSize : pageSize
      };
      // 发送请求
      $.ajax({
        type: 'get',
        url : 'offer/pageByUser',
        contentType: 'application/x-www-form-urlencoded',
        data : sendData,
        success : function (respData) {
          // 失败
          if (respData.code != 0) {
            // 提示
            $.toast({
              heading: '提示',
              text: respData.message,
              icon: 'info'
            });
            return;
          }
          // 成功构建页面
          buildMyOfferList(respData.data)
        }
      });
    }
    // 构造我的Offer列表
    function buildMyOfferList(data) {
      // 清空内容区
      $('#settings-offer-body').html('');
      // 没有记录
      if (data.rows.length == 0) {
        $('#settings-offer-body').html('<h3>没有职位记录</h3>');
        $('.bit-paginator-offer-text').html('');
        $('.bit-paginator-offer').html('');
        return;
      }
      // 遍历
      data.rows.forEach(offer => {
        // 头像
        if (!offer.publisher.avatarUrl) {
          offer.publisher.avatarUrl = avatarUrl;
        }
        // 最高价与最低价
        let priceHtml;
        if (!offer.job.rewardLower || !offer.job.rewardUpper) {
          priceHtml = '<strong>薪资面议</strong>'
        } else {
          priceHtml = ' <strong>' + offer.job.rewardLower + '</strong> - <strong>' + offer.job.rewardUpper + '</strong> '
        }
        // 状态
        let stateHtml;
        switch (offer.state) {
          case 0:
            stateHtml = '<span class="badge badge-outline text-yellow">未处理</span>';
            break;
          case 1:
            stateHtml = '<span class="badge badge-outline text-green">已接受</span>';
            break;
          case 2:
            stateHtml = '<span class="badge badge-outline text-red">已拒绝</span>';
            break;
        }
        // 一行记录
        let offerHtmlStr = '<div class="row g-0 align-items-center"> '
          + ' <div class="col-auto"> '
          + ' <div class="card-body"> '
          + ' <div class="avatar avatar-md" style="background-image: url(' + offer.publisher.avatarUrl + ')"></div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col"> '
          + ' <div class="card-body ps-0"> '
          + ' <div class="row"> '
          + ' <div class="col"> '
          + ' <h3 class="mb-0"><a href="javascript:void(0);" class="settings-offer-tab-job-title">' + offer.job.title + '</a></h3> '
          + ' </div> '
          + ' <div class="col-auto fs-3"> '
          + ' ' + stateHtml
          + ' </div> '
          + ' </div> '
          + ' <div class="row"> '
          + ' <div class="col-md"> '
          + ' <div class="mt-3 list-inline list-inline-dots mb-0 text-muted"> '
          + ' <div class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path> '
          + ' <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path> '
          + ' </svg> '
          + ' ' + offer.publisher.name
          + ' </div> '
          + ' <div class="list-inline-item text-blue"> '
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg> '
          + priceHtml
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col-md-auto"> '
          + ' <div class="mt-3 badges"> '
          + ' <div class="mt-3 list-inline list-inline-dots mb-0 text-muted"> '
          + ' <div class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg> '
          + ' ' + offer.createTime
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col-auto" style="margin-right: 1em;"> '
          + ' <div class="dropdown"> '
          + ' <a href="javascript:void(0);" class="btn-action" data-bs-toggle="dropdown" aria-expanded="false"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg> '
          + ' </a> '
          + ' <div class="dropdown-menu dropdown-menu-end"> '
          + ' <a href="javascript:void(0);" class="dropdown-item settins-offer-tab-accept"> '
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-check"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg> '
          + ' &nbsp;&nbsp;接 受 '
          + ' </a> '
          + ' <a href="javascript:void(0);" class="dropdown-item settins-offer-tab-reject"> '
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-x"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 6l-12 12" /><path d="M6 6l12 12" /></svg> '
          + ' &nbsp;&nbsp;拒 绝 '
          + ' </a> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div>'
          + ' <hr>';
        // 转换为jQuery对象
        let offerEL = $(offerHtmlStr);
        // 绑定事件
        // 详情
        offerEL.find('.settings-offer-tab-job-title').click(function() {
          // 当前访问的职位Id
          currentJobId = offer.jobId;
          // 加载编辑页
          $('#bit-page-content').load('job_details.html');
        });
        // 接受
        offerEL.find('.settins-offer-tab-accept').click(function () {
          procMyOfferstate(offer.id, 1); 
        });
        // 拒绝
        offerEL.find('.settins-offer-tab-reject').click(function () {

          procMyOfferstate(offer.id, 2); 
        });
        // 追加到内容区
        $('#settings-offer-body').append(offerEL);
      });
      // 分页显示
      buildMyOfferPaginator(data);
    }
    // Offer分页
    function buildMyOfferPaginator(data) {
      $('.bit-paginator-offer').jqPaginator({
        totalPages: data.totalPage,
        visiblePages: 10,
        currentPage: data.pageNum,
        first: '<li class="page-item first"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M11 7l-5 5l5 5" /><path d="M17 7l-5 5l5 5" /></svg></a></li>',
        prev: '<li class="page-item prev"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M15 6l-6 6l6 6" /></svg></a></li>',
        next: '<li class="page-item next"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M9 6l6 6l-6 6" /></svg></a></li>',
        last: '<li class="page-item last"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M7 7l5 5l-5 5" /><path d="M13 7l5 5l-5 5" /></svg></a></li>',
        page: '<li class="page-item page"><a class="page-link" href="javascript:void(0)">{{page}}</a></li>',
        onPageChange: function (pageNum, type) {
          $('.bit-paginator-offer-text').html('当前显示第 ' + pageNum + ' / ' + data.totalPage + ' 页');
          // 当前访问的页号
          currentOfferPageNum = pageNum;
          // 加载职位列表
          if (type == 'change') {
            loadMyOfferList(currentOfferPageNum);
          }
        }
      });
    }
    // 处理状态
    function procMyOfferstate(offerId, offerState) {
      console.info('offerId = ' + offerId + 'offerState = ' + offerState);
      // 要发送的数据
      let sendData = {
        id : offerId, 
        state : offerState
      };
      // 发送请求
      $.ajax({
        type : 'post', 
        url : 'offer/state', 
        data : JSON.stringify(sendData), 
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return;
          }
          // 成功提示
          if (offerState == 1) {
            toastSuccess('恭喜您!!! Offer已接受，请和HR联系确认.')
          } else if (offerState == 2) {
            toastWarning('Offer已被您拒绝.')
          } else {
            toastSuccess('OFFER处理成功');
          }
          // 刷新页面
          loadMyOfferList();
        }
      });
    }


    let currentFavoritePageNum = 1;
    // 收藏记录
    $('#settings-tab-favorites').click(function(){
      console.info('收藏记录');
      loadMyFavoriteList();
    });
    // 获取我的收藏列表
    function loadMyFavoriteList() {
      // 分页对象
      let sendData = {
        pageNum : currentFavoritePageNum,
        pageSize : pageSize
      };
      // 发送请求
      $.ajax({
        type: 'get',
        url : 'favorite/pageByUser',
        contentType: 'application/x-www-form-urlencoded',
        data : sendData,
        success : function (respData) {
          // 失败
          if (respData.code != 0) {
            // 提示
            $.toast({
              heading: '提示',
              text: respData.message,
              icon: 'info'
            });
            return;
          }
          // 成功构建页面
          buildMyFavoriteList(respData.data)
        }
      });
    }
    // 构造我的收藏列表
    function buildMyFavoriteList(data) {
      console.info(123);
      // 清空内容区
      $('#settings-favorite-body').html('');
      // 没有记录
      if (data.rows.length == 0) {
        $('#settings-favorite-body').html('<h3>没有职位记录</h3>');
        $('.bit-paginator-favorite-text').html('');
        $('.bit-paginator-favorite').html('');
        return;
      }
      // 遍历
      data.rows.forEach(favorite => {
        // 发布者头像
        if (!favorite.publisher.avatarUrl) {
          favorite.publisher.avatarUrl = avatarUrl
        }
        // 最高价与最低价
        let priceHtml;
        if (!favorite.job.rewardLower || !favorite.job.rewardUpper) {
          priceHtml = '<strong>薪资面议</strong>'
        } else {
          priceHtml = ' <strong>' + favorite.job.rewardLower + '</strong> - <strong>' + favorite.job.rewardUpper + '</strong> '
        }
        // 一个记录
        let favoriteHtmlStr = '<div class="row g-0 align-items-center"> '
          + ' <div class="col-auto"> '
          + ' <div class="card-body"> '
          + ' <div class="avatar avatar-md" style="background-image: url(' + favorite.publisher.avatarUrl + ')"></div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col"> '
          + ' <div class="card-body ps-0"> '
          + ' <div class="row"> '
          + ' <div class="col"> '
          + ' <h3 class="mb-0"><a href="javascript:void(0);" class="settings-favorite-tab-job-title">' + favorite.job.title + '</a></h3> '
          + ' </div> '
          + ' <div class="col-auto fs-3 text-blue"><svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg> '
          + ' ' + priceHtml
          + ' </div> '
          + ' </div> '
          + ' <div class="row"> '
          + ' <div class="col-md"> '
          + ' <div class="mt-3 list-inline list-inline-dots mb-0 text-muted"> '
          + ' <div class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path> '
          + ' <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path> '
          + ' </svg> '
          + ' ' + favorite.publisher.name
          + ' </div> '
          + ' <div class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-clock-edit" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M21 12a9 9 0 1 0 -9.972 8.948c.32 .034 .644 .052 .972 .052"></path> '
          + ' <path d="M12 7v5l2 2"></path> '
          + ' <path d="M18.42 15.61a2.1 2.1 0 0 1 2.97 2.97l-3.39 3.42h-3v-3l3.42 -3.39z"></path> '
          + ' </svg> '
          + ' ' + favorite.job.createTime
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col-md-auto"> '
          + ' <div class="mt-3 badges"> '
          + ' <ul class="list-inline list-inline-dots mb-0"> '
          + ' <li class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-eye" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M12 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"></path> '
          + ' <path d="M22 12c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7"></path> '
          + ' </svg> '
          + ' ' + favorite.job.visitCount
          + ' </li> '
          + ' <li class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-heart" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M19.5 12.572l-7.5 7.428l-7.5 -7.428a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572"></path> '
          + ' </svg> '
          + ' ' + favorite.job.favoriteCount
          + ' </li> '
          + ' <li class="list-inline-item"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message-circle" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> '
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> '
          + ' <path d="M3 20l1.3 -3.9a9 8 0 1 1 3.4 2.9l-4.7 1"></path> '
          + ' <path d="M12 12l0 .01"></path> '
          + ' <path d="M8 12l0 .01"></path> '
          + ' <path d="M16 12l0 .01"></path> '
          + ' </svg> '
          + ' ' + favorite.job.receiveCount
          + ' </li> '
          + ' </ul> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' <div class="col-auto" style="margin-right: 1em;"> '
          + ' <div class="col-6 col-sm-4 col-md-2 col-xl-auto py-3"> '
          + ' <a href="javascript:void(0);" class="btn btn-ghost-danger w-100 btn-icon settings-favorite-tab-delete" aria-label="Pinterest"> '
          + ' <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-trash"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M4 7l16 0"></path><path d="M10 11l0 6"></path><path d="M14 11l0 6"></path><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12"></path><path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3"></path></svg> '
          + ' </a> '
          + ' </div> '
          + ' </div> '
          + ' </div> '
          + ' <hr>';
        // 转换为jQuery对象
        let favoriteEL = $(favoriteHtmlStr);
        // 绑定事件
        // 详情
        favoriteEL.find('.settings-favorite-tab-job-title').click(function() {
          // 当前访问的职位Id
          currentJobId = favorite.jobId;
          // 加载编辑页
          $('#bit-page-content').load('job_details.html');
        });
        // 删除
        favoriteEL.find('.settings-favorite-tab-delete').click(function() {
          deleteMyFavorite(favorite.id);
        });
        // 追加到内容区
        $('#settings-favorite-body').append(favoriteEL);
      });

      // 分页
      buildMyFavoritePaginator(data);
    }
    // 收藏分页
    function buildMyFavoritePaginator(data) {
      $('.bit-paginator-favorite').jqPaginator({
        totalPages: data.totalPage,
        visiblePages: 10,
        currentPage: data.pageNum,
        first: '<li class="page-item first"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M11 7l-5 5l5 5" /><path d="M17 7l-5 5l5 5" /></svg></a></li>',
        prev: '<li class="page-item prev"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M15 6l-6 6l6 6" /></svg></a></li>',
        next: '<li class="page-item next"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M9 6l6 6l-6 6" /></svg></a></li>',
        last: '<li class="page-item last"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M7 7l5 5l-5 5" /><path d="M13 7l5 5l-5 5" /></svg></a></li>',
        page: '<li class="page-item page"><a class="page-link" href="javascript:void(0)">{{page}}</a></li>',
        onPageChange: function (pageNum, type) {
          $('.bit-paginator-favorite-text').html('当前显示第 ' + pageNum + ' / ' + data.totalPage + ' 页');
          // 当前访问的页号
          currentFavoritePageNum = pageNum;
          // 加载职位列表
          if (type == 'change') {
            loadMyFavoriteList();
          }
        }
      });
    }
    // 处理删除事件
    function deleteMyFavorite(favoriteId) {
      // 发送请求
      $.ajax({
        type : 'delete', 
        url : 'favorite/delete/' + favoriteId,
        contentType: 'application/x-www-form-urlencoded',
        success : function (respData) {
          if (respData.code != 0) {
            toastInfo(respData.message);
            return; 
          }
          // 提示
          toastSuccess('删除收藏成功.');
          // 刷新页面
          loadMyFavoriteList();
        }
      });
    }

    // ================================= 页面相关处理 ===================================
    // 日期控件
    let picker = new Litepicker({
      element: document.getElementById('settings-user-enrollment'),
      buttonText: {
          previousMonth: `<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 6l-6 6l6 6" /></svg>`,
          nextMonth: `<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 6l6 6l-6 6" /></svg>`
      },
    });
    // 选择头像
    $('.settings-chooice-user-avatar-btn').click(function() {
      let files = $('#settings-user-avatar-input');
      files.click();
    });
    
    // 处理侧边栏
    $('.settings-tab-item').click(function() {
      // 当前是否被选中
      if ($(this).hasClass('active')) {
        return;
      }
      // 隐藏之前显示的层
      let activeTab = $('.settings-tabs .active');
      $(activeTab.attr('data-bite-target')).attr('style', 'display: none!important;');
      // 取消之前的选中状态
      activeTab.removeClass('active');
      // 显示当前的层
      let currnetTab = $($(this).attr('data-bite-target'));
      currnetTab.removeAttr('style');
      // 当前的选中状态
      $(this).addClass('active');
    });

    // 安全隐私页
    $('.settings-tab-3-security-input').on('blur', function () {
      if ($(this).val()) {
        $(this).removeClass('is-invalid');
        $(this).addClass('is-valid');
      } else {
        $(this).removeClass('is-valid');
        $(this).addClass('is-invalid');
      }
    });

    $('.settings-tab-3-password-switch').on('click', function () {
      let inputEL = $(this).parent().parent().find('input');
        if(inputEL.attr('type') == 'password') {
          inputEL.attr('type', 'text');
        } else {
          inputEL.attr('type', 'password');
        } 
      }
    );
  });
</script>
